<template>
  <div>
    <BreakSpace label="整车信息" :containerStyle="{ marginBottom: '10px' }"/>
    <FormPanel
      ref="from"
      :list="formList"
      :cols="3"
      @formChange="changeHandle"
      :isSubmitBtn="false"
      labelWidth="80"/>
    <div class="dialogBottmView">
      <el-button :loading="saveLoading" @click="doupdate" type="primary">保存</el-button>
      <el-button @click="closeDialog" type="primary">返回</el-button>
    </div>
  </div>
</template>

<script>
  import moment from 'moment';
  import { doupdatebattery } from '@/api/customerService/arbitration/index';

  export default {
    name: 'dealwith',
    props: {
      type: {
        type: String,
        default: 'add'
      },
      rowData: {
        type: Object,
        default: () => ({})
      }
    },
    created() {
      this.formList.forEach(x => {
        x.initialValue = this.rowData[x.fieldName];
      });
    },
    data() {
      this.saveData = null;
      return {
        saveLoading: false,
        formList: this.createTopFilterList()
      };
    },
    methods: {
      // arrays是列表的数组,strarry是选中的数组
      filterarry(arrys,strarry,type){
       return strarry.map(i => {
          const obj = arrys.find(j => j.value === i)
          const filedMap = {
            '1': 'sjclfs',
            '2': 'sjgzyy',
            '3': 'sjclfs',
          }
          const result = {};
          if (obj.text==='满电里程不足'){
            result[filedMap[type]]='满电里程不足,满电显示____km,满电行驶____km'
          }else if (obj.text==='里程末端掉电'){
            result[filedMap[type]]='里程末端掉电,剩余____km无法行驶'
          }else {
            result[filedMap[type]]=obj.text;
          }
          result.id=obj.value
          if(obj.value1)result.mileage1 = obj.value1;
          if(obj.value2)result.mileage2 = obj.value2;
          return result;
        })
      },
      async doupdate() {
        const base = this.$refs.from.SUBMIT_FORM();
        if (base) {
          const arry= this.filterarry(this.formList[6].itemList,base.failurePhenomenon,'1')
          const arry1= this.filterarry(this.formList[9].itemList,base.failureCause,'2')
          const arry2= this.filterarry(this.formList[12].itemList,base.maintenanceDetail,'3')
          base.failurePhenomenon = JSON.stringify(arry);
          base.failureCause = JSON.stringify(arry1);
          base.maintenanceDetail = JSON.stringify(arry2);
          Object.assign(this.rowData, base);
          this.rowData.status = 'F';
          this.rowData.handleTime = moment(this.rowData.handleTime).format('YYYY-MM-DD HH:mm:ss');
          console.info(this.rowData)
          console.info('保存的数据')
          this.saveLoading = true;
          doupdatebattery(this.rowData).then(res => {
            if (res.resultCode === 200) {
              this.$notify.success({ title: '提示信息', message: '保存成功!' });
              // 重新加载
              this.saveLoading = false;
              this.closeDialog();
            } else {
              this.$notify.error({ title: '提示信息', message: res.errMsg || '保存失败!' });
              this.saveLoading = false;
              this.closeDialog();
            }
          });
        }
      },
      changechacheckbox(val){
        console.info(val)
        console.info('改变了')
      },
      createTopFilterList() {
        return [
          {
            type: 'INPUT',
            label: 'VIN',
            fieldName: 'vin',
            initialValue: '',
            disabled: true
          },
          {
            type: 'INPUT',
            label: '车型',
            fieldName: 'series',
            initialValue: '',
            disabled: true
          },
          {
            type: 'INPUT',
            label: '里程',
            fieldName: 'mileage',
            initialValue: '',
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          },
          {
            type: 'INPUT',
            label: '电商厂商',
            fieldName: 'batterySupplier',
            initialValue: '',
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          },
          {
            type: 'BREAK_SPACE',
            label: '处理信息'
          },
          {
            type: 'BREAK_SPACE',
            colRender:option=>{
              return (
                <h3 class='duty'>故障现象备注</h3>
              )
            }
          },
          {
            type: 'MULTIPLE_CHECKBOX',
            label: '',
            fieldName: 'failurePhenomenon',
            selfCols: 3,
            initialValue: '',
            rules: [
              {
                required: true, message: '至少选择一项故障现象备注', trigger: 'change'
              }],
            itemList: [
              { text: '弹屏故障', value: '1' },
              {
                text: '满电里程不足',
                value: '2',
                value1: '',
                value2: '',
                render: item => {
                  return (<div>
                    满电里程不足满电显示
                    <el-input  style="width: 60px" v-model={item.value1}/>
                    km,
                    满电行驶
                    <el-input  style="width: 60px;" v-model={item.value2}/>
                    km
                  </div>);
                }
              },
              {
                text: '里程末端掉电',
                value: '3',
                value1: '',
                render: item => {
                  return (<div>
                    里程末端掉电,剩余
                    <el-input style="width: 60px" v-model={item.value1}/>
                    km 无法行驶
                  </div>);
                }
              },
              { text: '无法行驶', value: '4' },
              { text: '无法快充', value: '5' },
              { text: '快充过慢', value: '6' },
              { text: '无法慢充', value: '7' },
              { text: '慢充慢', value: '8' },
              { text: '其他', value: '9' }
            ]
          },
          {//22
            type: 'TEXT_AREA',
            label: '信息补充',
            fieldName: 'failurePhenomenonExtra',
            placeholder: '请输入',
            initialValue: '',
            selfCols: 3,
            maxlength: 300,
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          },
          {
            type: 'BREAK_SPACE',
            colRender:option=>{
              return (
                <h3 class='duty'>故障原因详细描述</h3>
              )
            }
          },
          {
            type: 'MULTIPLE_CHECKBOX',
            label: '',
            fieldName: 'failureCause',
            selfCols: 3,
            initialValue: '',
            itemList: [
              { text: '压差过大', value: '1' },
              { text: '电芯故障', value: '2' },
              { text: 'BMS故障', value: '3' },
              { text: '低压插件/线束故障', value: '4' },
              { text: '高压插件/线束故障', value: '5' },
              { text: '扭矩不足', value: '6' },
              { text: '铜排松动', value: '7' },
              { text: '模组虚焊', value: '8' },
              { text: '内部进水', value: '9' },
              { text: '其他', value: '10' }
            ],
            rules: [
              {
                required: true, message: '至少选择一项故障原因详情描述', trigger: 'change'
              }]
          },
          {//22
            type: 'TEXT_AREA',
            label: '信息补充',
            fieldName: 'failureCauseExtra',
            placeholder: '请输入',
            initialValue: '',
            selfCols: 3,
            maxlength: 300,
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          },
          {
            type: 'BREAK_SPACE',
            colRender:option=>{
              return (
                <h3 class='duty'>检测及维修情况说明</h3>
              )
            }
          },
          {
            type: 'MULTIPLE_CHECKBOX',
            label: '',
            fieldName: 'maintenanceDetail',
            selfCols: 3,
            initialValue: '',
            itemList: [
              { text: '电芯补电', value: '1' },
              { text: '更换整包', value: '2' },
              { text: '更换单体', value: '3' },
              { text: '更换模组', value: '4' },
              { text: '更换子板', value: '5' },
              { text: '更换从板', value: '6' },
              { text: '更换电极盒', value: '7' },
              { text: '更换采集线束', value: '8' },
              { text: '更换低压线束', value: '9' },
              { text: '更换BMS程序', value: '11' },
              { text: '更换保险', value: '12' },
              { text: '其他', value: '13' }
            ],
            rules: [
              {
                required: true, message: '至少选择一项检测维修情况说明', trigger: 'change'
              }]
          },
          {//22
            type: 'TEXT_AREA',
            label: '信息补充',
            fieldName: 'maintenanceDetailExtra',
            placeholder: '请输入',
            initialValue: '',
            selfCols: 3,
            maxlength: 300,
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          },
          {
            type: 'INPUT',
            label: '服务站维修技师',
            labelWidth:'125px',
            fieldName: 'maintenanceTechnician',
            initialValue: '',
            selfCols: 1,
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          },
          {
            type: 'INPUT',
            label: '电池供应商售后人员',
            fieldName: 'afterSalePerson',
            labelWidth:'150px',
            initialValue: '',
            selfCols: 1,
            rules: [{
              required: true,
              message: '必填',
              trigger: 'change'
            }]
          }
        ];
      },
      //返回操作
      closeDialog() {
        this.$emit('close', { visible: false });
      },
      changeHandle(val) {
        this.saveData = val;
      }
    }
  };
</script>

<style scoped>
  .duty {
    width: 80%;
    height: 30px;
    line-height: 30px;
    margin-bottom: 5px;
    background: #eee;
    text-indent: 5px;
    margin-left: 80px;
  }
</style>
